<template>
  <div class="app-container">
    <SearchForm
      v-show="showSearch"
      v-model="queryParams"
      :options="[]"
      @onQuery="getList"
    >
      <template #default="{ filterForm, handleQuery }">
        <el-form-item label="排查时间">
          <el-input
            v-model="filterForm.checkTime"
            type="daterange"
            range-separator="-"
            style="width: 100%"
            @change="handleQuery"
            format="MM-DD"
            value-format="YYYY-MM-DD"
          />
        </el-form-item>
        <el-form-item label="排查状态">
          <el-input
            v-model="filterForm.checkState"
            style="width: 100%"
            @change="handleQuery"
          />
        </el-form-item>
        <el-form-item label="排查结果">
          <el-input
            v-model="filterForm.checkResult"
            style="width: 100%"
            @change="handleQuery"
          />
        </el-form-item>
      </template>
    </SearchForm>
    <el-row :gutter="10" class="mb8">
      <!-- <el-col :span="1.5">
        <el-button type="warning" plain @click="handlePush()"
          >推送任务数据</el-button
        >
      </el-col> -->
      <right-toolbar
        v-model:showSearch="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>
    <Table
      ref="table"
      :auto-featch="false"
      :fetch-data="fetchData"
      :options="[]"
      :useAction="false"
      @selectionChange="selectionChange"
    >
      <template #default>
        <el-table-column
          label="任务开始时间"
          align="center"
          key="startTime"
          prop="startTime"
        >
        </el-table-column>
        <el-table-column
          label="任务结束时间"
          align="center"
          key="endTime"
          prop="endTime"
        >
        </el-table-column>
        <el-table-column
          label="排查时间"
          align="center"
          key="checkTime"
          prop="checkTime"
        >
        </el-table-column>
        <el-table-column
          label="排查人员"
          align="center"
          key="checkUserName"
          prop="checkUserName"
        />
        <el-table-column
          label="任务状态"
          align="center"
          width="200"
          key="taskState"
          prop="taskState"
        />
        <el-table-column
          label="排查结果"
          align="center"
          width="200"
          key="checkResult"
          prop="checkResult"
        />
        <el-table-column label="隐患数量" align="center" width="100">
          <template #default="{ row }">
            <el-button type="text" @click="openYh(row)">{{
              row.countHidden
            }}</el-button>
          </template>
        </el-table-column>
      </template>
      <template #dangerNames="{ row }">
        {{ row.dangerName }}
      </template>
    </Table>
    <el-dialog v-model="yhVisible" width="70%" title="巡检隐患详情">
      <Yh ref="yhinner" :parentNode="parentNode"></Yh>
    </el-dialog>
  </div>
</template>

<script setup>
import Table from "@/components/Table/index.vue";
import SearchForm from "@/components/searchForm/index";
import { apis as APIS } from "@/api/yhpc/pcrwjl.js";
import { useAsyncData } from "@/views/hooks/useAsyncData.js";
import Yh from "./yh.vue";
import { pushTaskRecord } from "@/api/yhpc/push";
const { proxy } = getCurrentInstance();

const props = defineProps({
  parentNode: {
    type: Object,
    default: () => ({}),
  },
});

const showSearch = ref(true);
const dialogVform = ref();
const table = ref();
const filterForm = ref({});
const { fetchData, getList, queryParams, form } = useAsyncData({
  APIS,
  dialogVform,
  table,
  proxy,
  filterForm: filterForm.value,
});
watch(
  () => props.parentNode,
  (val) => {
    filterForm.value.checkTaskConfigId = val.id || null;
    getList();
  },
  {
    deep: true,
  }
);
const changeParent = (p) => {
  queryParams.value.checkTaskConfigId = p.id || null;
  getList();
};

const yhVisible = ref(false);
const parentNode = ref({});
const openYh = (row) => {
  yhVisible.value = true;
  nextTick().then(() => {
    parentNode.value = row;
  });
};
defineExpose({
  changeParent,
});

const selectList = ref([]);
const selectionChange = (rows) => {
  selectList.value = rows;
};

const handlePush = () => {
  if (selectList.value.length == 0) {
    proxy.$modal.msgError("未选择数据");
    return;
  }
  pushTaskRecord({
    ids: selectList.value.map((item) => item.id).join(","),
  }).then((res) => {
    if (res.msg.includes("成功")) {
      proxy.$modal.msgSuccess(res.msg);
    } else {
      proxy.$modal.msgError(res.msg);
    }
  });
};
</script>

<style lang="scss" scoped></style>
